
import "./SignUpLoading.scss"
import qs from 'qs'

import { useMount } from 'ahooks'
import { lazy, Suspense, useState } from 'react'
import { useRequest } from 'alova/client'
import { useNavigate, useLocation } from 'react-router-dom'

import { Http } from '../../API'
import { AddIndexdDB, IndexedDBClear } from '../../Utils/IndexedDB'
import { Button, App } from "antd"

const LoadSvg = lazy(() => import('../../View/Loading/LoadSvg'))

const Home = { rName: '首页', url: 'Home' }

const SignUpLoading = ({ data, Off }) => {
    const { notification } = App.useApp()
    const { search } = useLocation()
    const onNavigate = useNavigate()

    const [loading, setLoading] = useState(false)

    const { send: getCode } = useRequest(params => Http({ url: 'getThreeLoginInfo', params }), { immediate: false })
    const { send: getToken } = useRequest(params => Http({ url: 'posToken', params }), { immediate: false })
    const { send: getOperator } = useRequest(() => Http({ url: 'getOperator' }), { immediate: false })
    const { send: getOptions } = useRequest(params => Http({ url: 'getCiaoLiaoTypeInfoV2', params }), { immediate: false })
    const { send: getRoleInfo } = useRequest(params => Http({ url: 'getRoleInfo', params }), { immediate: false })
    const onAdmin = () => onNavigate('/Admin')
    const onStart = () => onNavigate('/Start')

    useMount(async () => {
        if (search) {
            setLoading(true)
            const urlParams = new URLSearchParams(search)
            const queryParams = {}
            urlParams.forEach((value, key) => queryParams[key] = value)
            try {
                const { token_type, access_token } = await getCode(queryParams)
                await AddIndexdDB('token', `${token_type} ${access_token}`)
                const { list } = await getOperator()
                await AddIndexdDB('userInfo', list)
                const [{ uid }] = list
                const options = await getOptions({ DataType: 'orgInfo' })
                await AddIndexdDB('options', options)
                const { list: menu } = await getRoleInfo({ uid })
                await AddIndexdDB('open', 'Home')
                await AddIndexdDB('openPage', ['Home'])
                await AddIndexdDB('menu', [Home, ...menu])
                setLoading(true)
                // onNavigate('/Admin')
            } catch (err) {
                console.log(err.data)
                IndexedDBClear()
                notification.error({ key: 'errror', message: '登录失败!', description: err.data })
                Off()
            }
        } else {
            const { username, password } = data
            const paramsA01 = qs.stringify({ client_secret: 20531901, client_id: "transport", grant_type: 'password', username, password })
            try {
                const { token_type, access_token } = await getToken(paramsA01)
                await AddIndexdDB('token', `${token_type} ${access_token}`)
                const { list } = await getOperator()
                await AddIndexdDB('userInfo', list)
                const [{ uid }] = list
                const options = await getOptions({ DataType: 'orgInfo' })
                await AddIndexdDB('options', options)
                const { list: menu } = await getRoleInfo({ uid })
                await AddIndexdDB('open', 'Home')
                await AddIndexdDB('openPage', ['Home'])
                await AddIndexdDB('menu', [Home, ...menu])
                setLoading(true)
                // onNavigate('/Admin')
            } catch (err) {
                IndexedDBClear()
                notification.error({ key: 'errror', message: '登录失败!', description: err.data })
                Off()
            }
        }
    })

    return (
        <Suspense>
            <div className='SignUpLoading'>
                {loading ?
                    <div className="onSign">
                        <Button type="primary" size="large" onClick={onAdmin}>后台</Button>
                        <Button size="large" onClick={onStart}>大屏</Button>
                    </div> :
                    <LoadSvg style={{ '--background': 'transparent', '--stroke': '#212121', height: '100%' }} />
                }
            </div>
        </Suspense>

    );
};

export default SignUpLoading